<template>
	<!--当前tabbar使用uview制作，暂时无用-->
	<view class="comp-base-utabbar-box" v-if="showTabbar">
		<u-tabbar 
			:value="currentIndex" 
			:border="true" 
			:zIndex="999999"
			activeColor="#1cbbb4"
			inactiveColor="#7d7e80">
			<template v-for="(item, index) in tabbarList">
				<u-tabbar-item :text="item.title" :icon="item.icon" :badge="item.badge" :dot="item.dot" @click="tabClick(item, index)"></u-tabbar-item>
			</template>
		</u-tabbar>
	</view>
</template>

<script>
	export default {
		name: "c-base-utabbar",
		props: {
			current: { // 导航栏下标
				type: Number,
				default: null
			},
			showTabbar: { // 是否显示导航栏
				type: Boolean,
				default: true
			},
			tabbars: { // 导航栏列表
				type: Array,
				default: (() => {
					return []
				})()
			}
		},
		data() {
			return {
				
			}
		},
		computed: {
			currentIndex: {
				get() {
					let v = this.current
					let val = null
					if (this.$tools.checkNumber(v, true)) {
						val = v
					}
					return val
				},
				set(v) {
					this.$emit('update:current', v)
				}
			},
			tabbarList: {
				get() {
					return this.tabbars
				},
				set(v) {
					this.$emit('update:tabbars', v)
				}
			}
		},
		methods: {
			tabClick(item, index) {
				this.mxNavigateTo(item)
				this.currentIndex = index
			}
		}
	}
</script>

<style scoped lang="scss">

</style>
